;(function(w,$){
	
	if( $ === undefined ){return ;}
	var rem = parseInt($('html').css('font-size'),10) ;
	
	$(w).on('resize load',function(){
		rem = parseInt($('html').css('font-size'),10) ;
	}) ;
	
	var wDrag = $('.w-drag') ;
	wDrag.each(function(){
		
		var bound = $(this)[0].getBoundingClientRect() ; 
		var Point = ({
			_panel : null ,
			_cnt : null ,
			initX : 0 ,
			initY : 0 ,
			startX : 0 ,
			startY : 0 ,
			init : function( panel , cnt ){
				this._panel = panel ;
				this._cnt = cnt ;
				return this ;
			} ,
			start : function(x,y){
				this.initX = parseFloat(this._cnt.css('left'))||0 ;
				this.initY = parseFloat(this._cnt.css('top'))||0 ;
				this.startX = x ;
				this.startY = y ;
				this.screenWidth = parseFloat(this._panel.css('width')) ;
				this.scrollWidth = 0 ;
				var self = this ;
				this._cnt.find('.w-drag-item').each(function(){
					self.scrollWidth += parseFloat($(this).width()) ;
				}) ;
			} ,
			move : function(x,y){
				var left = this.initX+(x-this.startX)/rem ;
				if( left < 1 && left > (this.screenWidth - this.scrollWidth)/rem - 2 ){
					this._cnt.css({
						left : left +'rem'
					}) ;
				}
			} ,
			end : function(){
								
			} 
		}).init( $(this) , $(this).find('.w-drag-cnt') ) ;
		
		$(this).on('touchstart touchmove',function(e){
			
			//@note 单点
			var touch = e.touches[0] ;
			var x = (touch.pageX - bound.left).toFixed(2) ;
			var y = (touch.pageY - bound.top).toFixed(2) ;
			
			if( e.type === 'touchstart' ){
				Point.start(x,y) ;
			}
			
			if( e.type === 'touchmove' ){
				Point.move(x,y) ;
			}
			
		}) ;	
		
		$(this).on('touchend',function(e){
			
			Point.end() ;
			
		}) ;
		
	}) ;
	

}(window,Zepto)) ;